<script type="text/javascript">
    $(function(){

        var imgsrc,ava,avatarCont,childNodes,max,erValue,mess,countErrors,error,i=0;

        avatarCont = window.parent.document.getElementById("avatar");
        countErrors = $(avatarCont).find('span.errors');

        if(countErrors.length >0){
            countErrors.remove();
        }
        if($('span#errorMessage').text() !==''){

            erValue =  document.getElementById('errorMessage');
            mess = $(erValue).text();
            error = document.createElement('span');
            error.className = 'errors';
            error.style.textAlign = 'center';
            error.innerHTML = mess;
            $(avatarCont).append(error);
        }else{
            imgsrc = document.getElementById('newavatar').src;
            childNodes = avatarCont.childNodes;
            max = childNodes.length;
            for(i;i < max;i+=1){
                if(childNodes[i].id === 'avatar'){
                    ava = childNodes[i].setAttribute('src',imgsrc);
                }
            }
        }
    });
</script>
<span id="errorMessage"><?=$this->errors[0] == true ? $this->errors[0] : '';?></span>
<img id="newavatar" src="<?=$this->avatar?>"/>